<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
	<title>公开课列表 - 扣丁在线在线网</title>
	<link rel="stylesheet" type="text/css" href="/static/css/reset.css">
	<link rel="stylesheet" type="text/css" href="/static/css/animate.css">
	<link rel="stylesheet" type="text/css" href="/static/css/style.css">

    <script src="/static/js/jquery.min.js" type="text/javascript"></script>
    <script src="/static/js/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>

</head>
<body>
<section class="headerwrap ">
    <header>
		<div  class=" header">
 			<div class="top">
				<div class="wp">
					<div class="fl"><p>服务电话：<b>33333333</b></p></div>
					<!--登录后跳转-->


                        <div class="personal">
                            <dl class="user fr">
                                <dd>bobby<img class="down fr" src="/static/images/top_down.png"/></dd>
                                <dt><img width="20" height="20" src="/static/media/image/2016/12/default_big_14.png"/></dt>
                            </dl>
                            <div class="userdetail">
                            	<dl>
	                                <dt><img width="80" height="80" src="/static/media/image/2016/12/default_big_14.png"/></dt>
	                                <dd>
	                                    <h2>django</h2>
	                                    <p>bobby</p>
	                                </dd>
                                </dl>
                                <div class="btn">
	                                <a class="personcenter fl" href="usercenter-info.html">进入个人中心</a>
	                                <a class="fr" href="/logout/">退出</a>
                                </div>
                            </div>
                        </div>
                        <a href="usercenter-message.html">
                            <div class="msg-num"> <span id="MsgNum">0</span></div>
                        </a>



				</div>
			</div>

            <div class="middle">
                <div class="wp">
                    <a href="index.html"><img class="fl" src="/static/images/logo.jpg"/></a>
                    <div class="searchbox fr">
                        <div class="selectContainer fl">
                            <span class="selectOption" id="jsSelectOption" data-value="course">
                                公开课
                            </span>
                            <ul class="selectMenu" id="jsSelectMenu">
                                <li data-value="course">公开课</li>
                                <li data-value="org">课程机构</li>
                                <li data-value="teacher">授课老师</li>
                            </ul>
                        </div>
                        <input id="search_keywords" class="fl" type="text" value="" placeholder="请输入搜索内容"/>
                        <img class="search_btn fr" id="jsSearchBtn" src="/static/images/search_btn.png"/>
                    </div>
                </div>
            </div>


			<nav>
				<div class="nav">
					<div class="wp">
						<ul>
							<li ><a href="index.html">首页</a></li>
							<li class="active">
								<a href="course-list.html">
									公开课<img class="hot" src="/static/images/nav_hot.png">
								</a>
							</li>
							<li >
								<a href="teachers-list.html">授课教师</a>
							</li>
							<li ><a href="org-list.html">授课机构</a></li>
						</ul>
					</div>
				</div>
			</nav>

			</div>
    </header>
</section>
<!--crumbs start-->

    <section>
	<div class="wp">
		<div class="crumbs">
			<ul>
				<li><a href="index.html">首页</a>></li>
                <li><a href="course-list.html">公开课程</a>></li>
				<li>课程详情</li>
			</ul>
		</div>
	</div>
</section>


<section>
		<div class="wp">
			<div class="groupPurchase_detail detail">
				<div class="toppro">
					<div class="left">
						<div class="picbox">
							<div class="tb-booth tb-pic">
								<img width="440" height="445" src="{{ MEDIA_URL }}{{ course.image }}" class="jqzoom" />
							</div>

						</div>
						<div class="des">
							<h1 title="django 从入门到精通体验开始了">{{ course.name }}</h1>
							<span class="key">{{ course.desc }}</span>
							<div class="prize">
								<span class="fl">难度：<i class="key">{{ course.get_degree_display }}</i></span>
								<span class="fr">学习人数：{{ course.students }}</span>
							</div>
							<ul class="parameter">
								<li><span class="pram word3">时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;长：</span><span>{{ course.learn_times }}</span></li>
								<li><span class="pram word3">章&nbsp;节&nbsp;数：</span><span>{{ course.get_zj_nums }}</span></li>
								<li><span class="pram word3">课程类别：</span><span title="">{{ course.category }}</span></li>
								<li class="piclist"><span class="pram word4">学习用户：</span>
									{% for user_course in course.get_learn_users %}
										<span class="pic"><img width="40" height="40" src="{{ MEDIA_URL }}{{ user_course.user.image }}"/></span>
									{% endfor %}
								</li>
							</ul>
							<div class="btns">
								<div class="btn colectgroupbtn"  id="jsLeftBtn">
									  {% if has_fav_course %}已收藏{% else %}收藏{% endif %}
								</div>
									<div class="buy btn"><a style="color: white" href="{% url 'course:course_info' course.id %}">开始学习</a></div>
							</div>
						</div>
						<div class="group-share-box">
							<div class="bdsharebuttonbox"
								 data-text="django开始了"
								 data-desc="我在#慕课网#发现了"
								 data-comment=""
								 data-url="/group/groupdetail/15/">
								<span class="fl">分享到：</span>
								<a href="#" class="bds_more" data-cmd="more"></a>
								<a title="分享到QQ空间" href="#" class="bds_qzone" data-cmd="qzone"></a>
								<a title="分享到新浪微博" href="#" class="bds_tsina" data-cmd="tsina"></a>
								<a title="分享到腾讯微博" href="#" class="bds_tqq" data-cmd="tqq"></a>
								<a title="分享到人人网" href="#" class="bds_renren" data-cmd="renren"></a>
								<a title="分享到微信" href="#" class="bds_weixin" data-cmd="weixin"></a>
							</div>
						</div>
					</div>
					<div class="right">
						<div class="head">
							<h1>授课机构</h1>
							<p>世界名校，课程权威</p>
						</div>
						<div class="pic">
							<a href="/company/14/">
								<img width="150" height="80" src="{{ MEDIA_URL }}{{ course.course_org.image }}"/>
							</a>
						</div>
						<a href="/company/14/">
							<h2 class="center" title="清华大学">{{ course.course_org.name }}</h2>
						</a>
						<div class="btn  notlogin
							 "data-favid="14" id="jsRightBtn">
							 {% if has_fav_org %}已收藏{% else %}收藏{% endif %}
						</div>
						<div class="clear">
							<ul>
								<li>
									<span>课 &nbsp;程&nbsp; 数：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;   {{ course.course_org.course_nums }}</span>
								</li>
								<li>
									<span>教 &nbsp;师&nbsp; 数：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  {{ course.course_org.get_teacher_nums }}</span>
								</li>
								<li>所在地区：&nbsp;&nbsp;{{ course.course_org.address }}</li>
								<li>认&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;证&nbsp;:
									&nbsp;&nbsp;

								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
		<section>
		<div class="wp">
			<div class="list groupPurchase_detail_pro">
				<div class="left layout">
					<div class="head">
						<ul class="tab_header">
							<li class="active">课程详情</li>
						</ul>
					</div>
					<div class="tab_cont tab_cont1">
						{% autoescape off %}
						{{ course.detail }}
						{% endautoescape %}
					</div>
					<div class="tab_cont tab_cont2" >
						<div class="comment">
							<div class="comenlist">

							</div>
						</div>
					</div>
				</div>
				<div class="right layout">
					<div class="head">相关课程推荐</div>
					<div class="group_recommend">
						{% for relate_course in relate_coures %}
							<dl>
								<dt>
									<a target="_blank" href="">
										<img width="240" height="220" class="scrollLoading" src="{{ MEDIA_URL }}{{ relate_course.image }}"/>
									</a>
								</dt>
								<dd>
									<a target="_blank" href=""><h2> {{ relate_course.name }}</h2></a>
									<span class="fl">学习时长：<i class="key">{{ relate_course.learn_times }}</i></span>
								</dd>
							</dl>
						{% endfor %}


					</div>
				</div>
			</div>
		</div>
	</section>

<footer>
		<div class="footer">
			<div class="wp">
				<ul class="cont">
					<li class="logo"><a href=""><img src="/static/images/footlogo.png"/></a></li>
					<li class="code"><img src="/static/images/code.jpg"/><p class="center">扫描关注微信</p></li>
					<li class="third"><img class="fl" src="/static/images/tell.png"/><p class="tell">33333333</p><p class="time">周一至周日 9:00-18:00</p></li>
				</ul>

			</div>
			<p class="line"></p>
			<div class="wp clear">
                <span class="fl">? 2016 www.projectsedu.com 扣丁在线在线-在线学习交流平台 保留所有权利</span>
                <span class="fr">copyright ? 2016 ICP备案证书号：蜀ICP备xxxxx号-1</span>
			</div>
		</div>
	</footer>

<section>
    <ul class="sidebar">
        <li class="qq">
            <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2023525077&site=qq&menu=yes"></a>
        </li>
        <li class="totop"></li>
    </ul>
</section>
<script src="/static/js/selectUi.js" type='text/javascript'></script>
<script src="/static/js/deco-common.js" type='text/javascript'></script>
<script type="text/javascript" src="/static/js/plugins/laydate/laydate.js"></script>
<script src="/static/js/plugins/layer/layer.js"></script>
<script src="/static/js/plugins/queryCity/js/public.js" type="text/javascript"></script>
<script src="/static/js/unslider.js" type="text/javascript"></script>
<script src="/static/js/plugins/jquery.scrollLoading.js"  type="text/javascript"></script>
<script src="/static/js/deco-common.js"  type="text/javascript"></script>

<script type="text/javascript">
//收藏分享
function add_fav(current_elem, fav_id, fav_type){
    $.ajax({
        cache: false,
        type: "POST",
        url:"/org/add_fav/",
        data:{'fav_id':fav_id, 'fav_type':fav_type},
        async: true,
        beforeSend:function(xhr, settings){
            xhr.setRequestHeader("X-CSRFToken", "5I2SlleZJOMUX9QbwYLUIAOshdrdpRcy");
        },
        success: function(data) {
            if(data.status == 'fail'){
                if(data.msg == '用户未登录'){
                    window.location.href="login.html";
                }else{
                    alert(data.msg)
                }

            }else if(data.status == 'success'){
                current_elem.text(data.msg)
            }
        },
    });
}

$('#jsLeftBtn').on('click', function(){
    add_fav($(this), 10, 1);
});

$('#jsRightBtn').on('click', function(){
    add_fav($(this), 2, 2);
});


</script>


</body>
</html>
